<template>
	<view class="container">
		<u-sticky  bgColor="#fff">
			<u-tabs :list="tabList" :scrollable="false" @click="clickTab"></u-tabs>
		</u-sticky>
		<view class="con-box">
			<uni-card acWidth="686rpx"  v-for="(item,index) in acList" :key="index">
				<view class="u-flex">
					<view class="left-box">
						<image class="headImg" v-if="item.sendType == 0" :src="'https://www.ydylmold.cn/images/ydylapp/usrCraftsman/image/'+item.headImg" mode=""></image>
						<image class="headImg" v-else :src="'https://www.ydylmold.cn/images/ydylapp/usrCompany/image/'+item.companyLogo" mode=""></image>
					</view>
					<view class="right-box u-flex u-flex-col u-col-top" style="margin-left: 20rpx;">
						<text>{{timeDifference($u.timeFormat(new Date(item.sendTime),'yyyy-mm-dd hh:MM:ss'))}}</text>
						<text>用户名：{{item.usrName}}</text>
						<text>标题：{{item.title}}</text>
						<text style="color: #0080FF;" @click="openPop(item)">点击打开留言</text>
					</view>
					<view @click.stop="delItem(item,index)" class="icon-box" style="position: absolute;right: 20rpx;">
						<u-icon size="20" name="trash"></u-icon>
					</view>
				</view>
			</uni-card>
			
		</view>
		<u-popup @close="showTextPop = false" :show="showTextPop" closeable mode="center" round="30">
			<view class="pop-box" style="padding:60rpx 30rpx 30rpx 30rpx;min-width: 700rpx;min-height: 400rpx;">
				<text>留言内容：</text>
				<view style="max-width: 650rpx;line-height: 46rpx;">{{acText}}</view>
			</view>
		</u-popup>
		<my-empty tipText="数据为空"  image="http://cdn.uviewui.com/uview/empty/data.png" v-if="isEmpty"></my-empty>
		<u-loadmore :status="status" v-else></u-loadmore>
	</view>
</template>



<script>
import {
		timeDifference
	} from "@/utils/formaterTime.js"
	import {usrCompanyMessageQueryList,usrCompanyMessageDelete} from '@/common/api/msg.js'
	import {getToken} from '@/utils/token.js'
	export default {
		data() {
			return {
				tabList: [{
					name: '未读',
				}, {
					name: '已读',
				}],
				acIndex:0,
				currPage:1,
				isEmpty:false,
				allPage:1,
				acList:[],
				status:'loading',
				showTextPop:false,
				acText:''
			}
		},
		onLoad:function(){
			this.usrCompanyMessageQueryList()
		},
		onReachBottom:function(){
			if(this.status == 'loadmore'){
				this.currPage++
				this.usrCompanyMessageQueryList()
			}
		},
		methods:{
			timeDifference,
			openPop(item){
				this.acText = item.content
				this.showTextPop = true
			},
			clickTab(data) {
				this.acIndex = data.index
				this.acList = []
				this.currPage = 1
				this.usrCompanyMessageQueryList()
			},
			delItem(item,index){
				uni.showModal({
					title:'提示',
					content:'您确定要删除该留言吗？',
					success: (e) => {
						if(e.confirm){
							usrCompanyMessageDelete({
								id:item.id
							}).then(res=>{
								if(res.data && res.data.code == 1){
									this.acList.splice(index,1)
									this.$u.toast('删除成功')
								}
							})
						}
					}
				})
			},
			usrCompanyMessageQueryList(){
				this.status = 'loading'
				usrCompanyMessageQueryList({
					'page.current':this.currPage,
					receiveType:1,
					readState:this.acIndex,
					receiveNo:getToken('useNum')
				}).then(res=>{
					this.acList = res.data && res.data.rows
					this.isEmpty = this.acList.length?false:true
					this.allPage = res.data.total
					this.currPage < this.allpage ? this.status = 'loadmore' : this.status = 'nomore'
				})
			},
			getNewList(){
				
			}
		}
	}
</script>

<style scoped lang="scss">
	.container{
		background-color: #F8F8F8;
		min-height: calc(100vh - var(--window-top));
		.con-box{
			.headImg{
				width: 100rpx;
				height: 100rpx;
				border-radius: 50%;
			}
		}
	}
</style>
